<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta name="renderer" content="webkit">
    <title>添加内容</title>
    <link rel="stylesheet" href="__CSS__/pintuer.css">
    <link rel="stylesheet" href="__CSS__/admin.css">
    <link rel="stylesheet" href="__STATIC__/css/layui.css">
    <script src="__STATIC__/layui.js"></script>
    <script src="__JS__/jquery.js"></script>
    <script src="__JS__/pintuer.js"></script>
</head>

<body>
<div class="panel admin-panel">
    <div style="margin-bottom: 1%" class="panel-head"><strong class="icon-reorder">合同申请单详情</strong>&emsp;&emsp;<a
            style="color: #3a4bfb;font-weight: bold " href="javascript:history.go(-1)">返回上一步</a></div>

    <h3 align="center" style="margin:30px">审批状态</h3>
    <div style="width: 900px; margin: auto">
    <table width="900px" border="1" class="layui-table">
        <thead>
        <tr align="center" valign="middle">
            <td>审批角色</td>
            <td>审批结果</td>
            <td>审批意见</td>
        </tr>
        </thead>
        <tr align="center" valign="middle">

            <td>{$contract_form.role}</td>
            <td>{$contract_form.apply_state}</td>
            <td>{$contract_form.audit_opinion}</td>
        </tr>
    </table>
</div>
    <div style="margin-top: 2%">
        {if condition="$contract_form.apply_states eq 2"}
        <form class="layui-form" method="post" enctype="multipart/form-data">
            <h3 style="text-align: center;margin-top: 3%"><b>合同申请表</b></h3>
            <input type="hidden" value="8" name="bill_type_id">
            <input type="hidden" value="{$contract_form.id}" name="id">
            <div style="margin-top: 2%" class="layui-form-item">
                <div class="layui-inline">
                    <label style="float: left;margin-top: 3%" class="layui-form-lable">合同流程：</label>
                    <div style="float:left;" class="layui-inline-input">
                        <select name="contract_flow_id" id="contract_flow_id">
                            {volist name="contract_form_flow" id="vo"}
                            {if condition="$vo.id eq $contract_form.contract_flow_id"}
                            <option selected="selected" value="{$vo.id}">{$vo.flow}</option>
                            {else /}
                            <option value="{$vo.id}">{$vo.flow}</option>
                            {/if}
                            {/volist}
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <label style="float: left;margin-top: 3%" class="layui-form-lable">申请时间：</label>
                    <div style="float:left;" class="layui-inline-input">
                        <input value="{$contract_form.contract_approve_time}" id="contract_approve_time" name="contract_approve_time" class="layui-input" type="text"
                               lay-verify="date|required" placeholder="yyyy-MM-dd">
                    </div>
                </div>
            </div>
            <table class="layui-table" lay-size="lg">
                <colgroup>
                    <col width="150">
                    <col width="150">
                    <col width="150">
                    <col width="150">
                </colgroup>
                <tr>
                    <td style="text-align: center;vertical-align: middle">提交区域：</td>
                    <td style="text-align: center;vertical-align: middle">
                        <select lay-verify="required" name="sub_region" lay-search="">
                            {volist name="sub_region" id="re"}
                            {if condition="$re.id eq $contract_form.sub_region"}
                            <option selected="selected" value="{$re.id}">{$re.region}</option>
                            {else /}
                            <option value="{$re.id}">{$re.region}</option>
                            {/if}
                            {/volist}
                        </select>
                    </td>
                    <td style="text-align: center;vertical-align: middle">合同类别：</td>
                    <td style="text-align: center;vertical-align: middle">
                        <select name="contract_type" lay-search="" lay-verify="required">
                            {volist name="contract_type" id="ty"}
                            {if condition="$ty.id eq $contract_form.contract_type"}
                            <option selected="selected" value="{$ty.id}">{$ty.contract_type}</option>
                            {else /}
                            <option value="{$ty.id}">{$ty.contract_type}</option>
                            {/if}
                            {/volist}
                        </select>
                    </td>
                </tr>
                <tr>
                    <td style="text-align: center;vertical-align: middle">合同名称：</td>
                    <td style="text-align: center;vertical-align: middle">
                        <input name="contract_name" value="{$contract_form.contract_name}" lay-verify="required" id="contract_name" type="text"
                               class="layui-input">
                    </td>
                    <td style="text-align: center;vertical-align: middle">合同编号：</td>
                    <td style="text-align: center;vertical-align: middle">
                        <input name="contract_code" value="{$contract_form.contract_code}" lay-verify="required" id="contract_code" type="text"
                               class="layui-input">
                    </td>
                </tr>
                <tr>
                    <td style="text-align: center;vertical-align: middle">合同对方：</td>
                    <td style="text-align: center;vertical-align: middle">
                        <input name="contract_party" value="{$contract_form.contract_party}" lay-verify="required" id="contract_party" type="text"
                               class="layui-input">
                    </td>
                    <td style="text-align: center;vertical-align: middle">合同签订时间：</td>
                    <td style="text-align: center;vertical-align: middle">
                        <input class="layui-input" value="{$contract_form.contract_time}" lay-verify="date|required" placeholder="yyyy-MM-dd"
                               name="contract_time" id="contract_time" type="text">
                    </td>
                </tr>
                <tr>
                    <td style="text-align: center;vertical-align: middle">合同暂定价：</td>
                    <td style="text-align: center;vertical-align: middle">
                        <input name="contract_temporary_price" value="{$contract_form.contract_temporary_price}" id="contract_temporary_price" type="text"
                               class="layui-input">
                    </td>
                    <td style="text-align: center;vertical-align: middle">合同结算价：</td>
                    <td style="text-align: center;vertical-align: middle">
                        <input name="contract_settlement_price" value="{$contract_form.contract_settlement_price}" id="contract_settlement_price" type="text"
                               class="layui-input">
                    </td>
                </tr>
                <tr>
                    <td style="text-align: center;vertical-align: middle">合同描述：</td>
                    <td colspan="3" style="text-align: center;vertical-align: middle">
                        <div style="margin-left: 0" class="layui-input-block">
                                    <textarea name="contract_description" placeholder="" class="layui-textarea">{$contract_form.contract_description}</textarea>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td style="text-align: center;vertical-align: middle">付款进度：</td>
                    <td colspan="3" style="text-align: center;vertical-align: middle">
                        <div style="margin-left: 0" class="layui-input-block">
                                    <textarea name="contract_payment_progress" placeholder="" class="layui-textarea">{$contract_form.contract_payment_progress}</textarea>
                        </div>
                    </td>
                </tr>
            </table>
            <div class="layui-form-item">
                <div style="float: right;margin-top: 2%;margin-right: 10%" class="layui-input-block">
                    <button class="layui-btn" lay-submit="" lay-filter="demo_contract">
                        立即提交
                    </button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
        <div class="layui-upload">
            <button style="margin-left: 1%" type="button" class="layui-btn layui-btn-normal" id="testList">重新上传相关文件</button>
            <div class="layui-upload-list">
                <table class="layui-table">
                    <thead>
                    <tr>
                        <th>文件名</th>
                        <th>大小</th>
                        <th>状态</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody id="demoList"></tbody>
                </table>
            </div>
            <button style="margin-left: 1%;margin-bottom: 1%" type="button" class="layui-btn" id="upload_contract_form">开始上传</button>
        </div>
        {else /}
        <form class="layui-form" method="post" enctype="multipart/form-data">
        <h3 style="text-align: center;margin-top: 3%"><b>合同申请表</b></h3>
        <input type="hidden" value="8" name="bill_type_id">
        <div style="margin-top: 2%" class="layui-form-item">
            <div class="layui-inline">
                <label style="float: left;margin-top: 3%" class="layui-form-lable">合同流程：</label>
                <div style="float:left;" class="layui-inline-input">
                    <select name="contract_flow_id">
                        {volist name="contract_form_flow" id="vo"}
                        {if condition="$vo.id eq $contract_form.contract_flow_id"}
                        <option selected="selected" value="{$vo.id}">{$vo.flow}</option>
                        {else /}
                        <option value="{$vo.id}">{$vo.flow}</option>
                        {/if}
                        {/volist}
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label style="float: left;margin-top: 3%" class="layui-form-lable">申请时间：</label>
                <div style="float:left;" class="layui-inline-input">
                    <input value="{$contract_form.contract_approve_time}" readonly="readonly" class="layui-input" type="text">
                </div>
            </div>
        </div>
        <table class="layui-table" lay-size="lg">
            <colgroup>
                <col width="150">
                <col width="150">
                <col width="150">
                <col width="150">
            </colgroup>
            <tr>
                <td style="text-align: center;vertical-align: middle">提交区域：</td>
                <td style="text-align: center;vertical-align: middle">
                    <select lay-verify="required" name="sub_region" lay-search="">
                        {volist name="sub_region" id="re"}
                        {if condition="$re.id eq $contract_form.sub_region"}
                        <option selected="selected" value="{$re.id}">{$re.region}</option>
                        {else /}
                        <option value="{$re.id}">{$re.region}</option>
                        {/if}
                        {/volist}
                    </select>

                </td>
                <td style="text-align: center;vertical-align: middle">合同类别：</td>
                <td style="text-align: center;vertical-align: middle">
                    <select name="contract_type" lay-search="" lay-verify="required">
                        {volist name="contract_type" id="ty"}
                        {if condition="$ty.id eq $contract_form.contract_type"}
                        <option selected="selected" value="{$ty.id}">{$ty.contract_type}</option>
                        {else /}
                        <option value="{$ty.id}">{$ty.contract_type}</option>
                        {/if}
                        {/volist}
                    </select>
                </td>
            </tr>
            <tr>
                <td style="text-align: center;vertical-align: middle">合同名称：</td>
                <td style="text-align: center;vertical-align: middle">
                    <input readonly="readonly"  value="{$contract_form.contract_name}" type="text"
                           class="layui-input">
                </td>
                <td style="text-align: center;vertical-align: middle">合同编号：</td>
                <td style="text-align: center;vertical-align: middle">
                    <input readonly="readonly"  value="{$contract_form.contract_code}" type="text"
                           class="layui-input">
                </td>
            </tr>
            <tr>
                <td style="text-align: center;vertical-align: middle">合同对方：</td>
                <td style="text-align: center;vertical-align: middle">
                    <input readonly="readonly" value="{$contract_form.contract_party}" type="text"
                           class="layui-input">
                </td>
                <td style="text-align: center;vertical-align: middle">合同签订时间：</td>
                <td style="text-align: center;vertical-align: middle">
                    <input readonly="readonly" class="layui-input" value="{$contract_form.contract_time}" type="text">
                </td>
            </tr>
            <tr>
                <td style="text-align: center;vertical-align: middle">合同暂定价：</td>
                <td style="text-align: center;vertical-align: middle">
                    <input readonly="readonly" type="text" value="{$contract_form.contract_temporary_price}" class="layui-input">
                </td>
                <td style="text-align: center;vertical-align: middle">合同结算价：</td>
                <td style="text-align: center;vertical-align: middle">
                    <input readonly="readonly"  value="{$contract_form.contract_settlement_price}" type="text" class="layui-input">
                </td>
            </tr>
            <tr>
                <td style="text-align: center;vertical-align: middle">合同描述：</td>
                <td colspan="3" style="text-align: center;vertical-align: middle">
                    <div style="margin-left: 0" class="layui-input-block">
                                    <textarea readonly="readonly" placeholder="" class="layui-textarea">{$contract_form.contract_description}</textarea>
                    </div>
                </td>
            </tr>
            <tr>
                <td style="text-align: center;vertical-align: middle">付款进度：</td>
                <td colspan="3" style="text-align: center;vertical-align: middle">
                    <div style="margin-left: 0" class="layui-input-block">
                                    <textarea readonly="readonly"  placeholder="" class="layui-textarea">{$contract_form.contract_payment_progress}</textarea>
                    </div>
                </td>
            </tr>
        </table>
    </form>
        {/if}

    </div>
</div>
<a style="margin-top: 4%;float: right;margin-right: 35%;margin-bottom: 5%" class="layui-btn"
   href="{:url('Myself/myselfapprove')}">返回</a>

<a style="margin-top: 4%;float: right;margin-right: 15%;margin-bottom: 5%" class="layui-btn"
   href="{:url('Myself/contract_form_excel')}?id={$contract_form.id}">下载单据打印表格</a>
</body>
<script>
    layui.use('element', function () {
        var $ = layui.jquery
            , element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块

        //触发事件
        var active = {
            tabAdd: function () {
                //新增一个Tab项
                element.tabAdd('demo', {
                    title: '新选项' + (Math.random() * 1000 | 0) //用于演示
                    , content: '内容' + (Math.random() * 1000 | 0)
                    , id: new Date().getTime() //实际使用一般是规定好的id，这里以时间戳模拟下
                })
            }

        };

        $('.site-demo-active').on('click', function () {
            var othis = $(this), type = othis.data('type');
            active[type] ? active[type].call(this, othis) : '';
        });

        //Hash地址的定位
        var layid = location.hash.replace(/^#test=/, '');
        element.tabChange('test', layid);

        element.on('tab(test)', function (elem) {
            location.hash = 'test=' + $(this).attr('lay-id');
        });

    });
</script>
<script>
    layui.use(['form', 'layer', 'laydate'], function () {
        var form = layui.form
            , layer = layui.layer
            , laydate = layui.laydate;

        //日期时间范围
        laydate.render({
            elem: '#leave_time'
            , type: 'datetime'
            , range: true
        });
        //合同申请日期
        laydate.render({
            elem: '#contract_approve_time'
        });
        //合同签订日期
        laydate.render({
            elem: '#contract_time'
        });
        //监听提交
        form.on('submit(demo_contract)', function (data) {
            var datas = JSON.stringify(data.field);
            //console.log(datas);
            var sub = 'submit';
            $.ajax({
                type: "post",
                url: "{:url('Myself/myselfapprove_contract_form_saves')}",
                data: {"data": datas, 'sub': sub},
                dataType: "json",
                success: function (a) {
                    console.log(a);
                    if (a > 0) {
                        layer.msg('添加成功', {icon: 1});
                        //layer.close(index);
                        //window.setTimeout("window.location=\"{:url('Myself/myselfapprove')}\"", 2000);
                    } else {
                        layer.msg('添加失败', {icon: 2});
                        //layer.close(index);
                        setTimeout(function () {
                            //使用  setTimeout（）方法设定定时2000<a href="https://www.baidu.com/s?wd=%E6%AF%AB%E7%A7%92&tn=44039180_cpr&fenlei=mv6quAkxTZn0IZRqIHckPjm4nH00T1dWuHn4n1DkmynYmhu9uhcd0ZwV5Hcvrjm3rH6sPfKWUMw85HfYnjn4nH6sgvPsT6KdThsqpZwYTjCEQLGCpyw9Uz4Bmy-bIi4WUvYETgN-TLwGUv3EnHf4PWmsrHRdnWckPWnkrHmkrf" target="_blank" class="baidu-highlight">毫秒</a>
                            window.location.reload();//页面刷新
                        }, 2000);
                    }

                }

            });
            return false;
        });

    });
</script>
<script>
    layui.use('upload', function () {
        var $ = layui.jquery
            , upload = layui.upload
            , layer = layui.layer;

        //多文件列表示例
        var demoListView = $('#demoList')
            ,uploadListIns = upload.render({
            elem: '#testList'
            ,url: "{:url('Myself/uploads')}"
            ,accept: 'file'
            ,multiple: true
            ,auto: false
            ,bindAction: '#upload_contract_form'
            ,choose: function(obj){
                var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
                //读取本地文件
                obj.preview(function(index, file, result){
                    var tr = $(['<tr id="upload-'+ index +'">'
                        ,'<td>'+ file.name +'</td>'
                        ,'<td>'+ (file.size/1014).toFixed(1) +'kb</td>'
                        ,'<td>等待上传</td>'
                        ,'<td>'
                        ,'<button class="layui-btn layui-btn-mini demo-reload layui-hide">重传</button>'
                        ,'<button class="layui-btn layui-btn-mini layui-btn-danger demo-delete">删除</button>'
                        ,'</td>'
                        ,'</tr>'].join(''));

                    //单个重传
                    tr.find('.demo-reload').on('click', function(){
                        obj.upload(index, file);
                    });

                    //删除
                    tr.find('.demo-delete').on('click', function(){
                        delete files[index]; //删除对应的文件
                        tr.remove();
                        uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
                    });

                    demoListView.append(tr);
                });
            }
            ,done: function(res, index, upload){
                //console.log(res);
                if(res.code == 0){ //上传成功
                    var tr = demoListView.find('tr#upload-'+ index)
                        ,tds = tr.children();
                    tds.eq(2).html('<span style="color: #5FB878;">'+res.msg+'</span>');
                    tds.eq(3).html(''); //清空操作
                    return delete this.files[index]; //删除文件队列已经上传成功的文件
                }
                this.error(index, upload);
            }
            ,error: function(index, upload){
                var tr = demoListView.find('tr#upload-'+ index)
                    ,tds = tr.children();
                tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
                tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
            }
        });
    });
</script>
</html>